<%@page import="com.gao.domain.Cart"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title></title>
	<!-- 新 Bootstrap 核心 CSS 文件 -->
		<link rel="stylesheet" href="css/bootstrap.css">
		<link rel="stylesheet" href="css/cart.css" />
		<!-- 可选的Bootstrap主题文件（一般不用引入） -->
		<link rel="stylesheet" href="css/bootstrap-theme.css">
		<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
		<script src="js/jquery-1.11.3.js"></script>
		<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
		<script src="js/bootstrap.js"></script>
		<script type="text/javascript" src="js/cart2.js"></script>
</head>

<body>
	<!--top bar制作-->
	<nav class="navbar navbar-default" role="navigation">
	<div class="container-fluid">
		<!-- Brand and toggle get grouped for better mobile display -->
		<div class="navbar-header">
			<button type="button" class="navbar-toggle collapsed"
				data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
				<span class="sr-only">Toggle navigation</span> <span
					class="icon-bar"></span> <span class="icon-bar"></span> <span
					class="icon-bar"></span>
			</button>
			<!-- <a class="navbar-brand" href="#"><img src="img/logo.png" height="30px"/></a>-->
		</div>

		<!-- Collect the nav links, forms, and other content for toggling -->
		<div class="collapse navbar-collapse"
			id="bs-example-navbar-collapse-1">
			<ul class="nav navbar-nav">
				<li class="active"><a href="ProductsIndexServlet">小米商城</a></li>
				<li><a href="#">米聊</a></li>
				<li><a href="#">游戏</a></li>
				<li><a href="#">多看阅读</a></li>
				<li><a href="#">云服务</a></li>
				<li><a href="#">米聊</a></li>
			</ul>
			<ul class="nav navbar-nav navbar-right">
			 	<li><a href="login.jsp">登录</a></li>
		        <li><a href="register.jsp">注册</a></li>
				<li><a href="#">消息通知</a></li>
				<li><a href="CartDetailServlet">购物车</a></li>

			</ul>
		</div>
		<!-- /.navbar-collapse -->
	</div>
	<!-- /.container-fluid --> </nav>
	
	<!--购物车的主体-->
		<div class="row">
			<!--表头的开始-->
			<div class="col-md-8 col-md-offset-2">
				<div class="row text-valign">
					<div class="col-md-1"><a href="ProductsIndexServlet"><img src="img/logo.png" /></a></div>
					<div class="col-md-3">
						<h3>我的购物车</h3></div>
					<div class="col-md-8"> 温馨提示：产品是否购买成功，以最终下单为准哦，请尽快结算</div>
				</div>
				<!--表头的结束-->
				<%List<Cart> carts = (List<Cart>)request.getAttribute("carts"); %>
				<%if(carts.size()==0){ %>
					<div class="row text-valign">
						<div class="col-md-3 col-md-offset-2">
							<img src="img/cartnull.jpg" width="200px" align="left" valign="middle"/>
						</div>
						<div class="col-md-4">
							<h3>我的购物车为空！</h3>
						</div>
					</div>
				<%}else{ %>
				<table class="table table-bordered">
					<tr>
						<th>ID</th>
						<th>商品名称</th>
						<th>单价</th>
						<th>数量</th>
						<th>小计</th>
						<th>操作</th>
					</tr>
					<!-- 遍历购物车中的数据 -->
					<%for(Cart cart:carts){%>
						<tr>
							<th><%=cart.getProduct().getPid() %></th>
							<th><%=cart.getProduct().getName() %></th>
							<th><%=cart.getProduct().getPrice() %></th>
							<th>
								<div class="input-group">
									<span class="input-group-addon subOne">-</span>
									<input type="text" class="form-control" value="<%=cart.getCartNum() %>" id="num1">
									<span class="input-group-addon addOne">+</span>
								</div>
							</th>
							<th class="smallPrice"><%=cart.getCartNum()*cart.getProduct().getPrice() %> </th>
							<th><button type="button" class="btn btn-default" onclick="window.location.href='CartDeleteServlet?cid=<%=cart.getCid() %>'">删除</button></th>
						</tr>
					<%}%>
				
					<tr>
						<th colspan="6">
							总计：<span id="allPrice">￥<%=request.getAttribute("totalPrice") %></span>
							<input type="submit" value="立即结算" class="btn2" onclick="window.location.href='OrderAccountServlet'" />
						</th>
					</tr>
				</table>
			<%} %>
			</div>
		</div>
		
	<!--底部设置-->
	<hr />
	<div class="row">
		<div class="col-md-6 col-md-offset-3">
			<div class="row">
				<div class="col-md-2 col-md-offset-1">预约维修服务</div>
				<div class="col-md-2">7天无理由退货</div>
				<div class="col-md-2">15天免费换货</div>
				<div class="col-md-2">520余家售后网点</div>
				<div class="col-md-2 ">满150元包邮</div>
			</div>
		</div>
	</div>
</body>
</html>
